<template>
	<view class="task_detail">
		<!-- 文章详情页面 -->
		<view class="detail">
			<!-- 详情标题 -->
			<view class="detail_title">
				{{taskeDetails.taskName}}
			</view>
			<!-- 发布事件 -->
			<u-row class="source_views" justify="space-between">
				<u-col span="6">
					发布人 {{taskeDetails.createBy}}
				</u-col>
				<!-- <u-col span="3">
					小程序任务
				</u-col> -->
				<u-col span="6" class="views">
					截止 {{handleTime}}
				</u-col>
			</u-row>
			<!-- 详情 -->
			<view class="detail_info">
				<!-- 文章一二分类标题 -->
				<!-- <view class="info_title">
					<image src="../../static/img/bdimg.jpeg" mode=""></image>
				</view> -->
				<!-- 文章详情内容信息 -->
				<view class="info_conent">
					{{taskeDetails.description}}
				</view>
			</view>
		</view>
		<view class="empty_placeholder">
		</view>
		<!-- 领取任务 -->
		<view class="task_bar">
			<u-button type="primary" text="领取任务" class="receive_btn" color="#7A7A7A" :customStyle="customStyles" size="large" @tap="ToReceiveTask">
			</u-button>
		</view>
	</view>
</template>

<script>
	import {
		taskDetail, claimTask
	} from '@/config/api.js';
	export default {
		data() {
			return {
				customStyles: {
					// 不支持
					fontSize: '20px',
				},
				taskeDetails: {},
				id:'',
				// assignee: ''
				// 客户id
				customerId:''
			};
		},
		created() {
			// 客户编号
			this.customerId = uni.getStorageSync('customerId')
		},
		onLoad(option) {
			this.id = option.id
			taskDetail(option).then(res => {
				console.log(res)
				this.assignee = res.data.assignee
				this.taskeDetails = res.data
			})
		},
		computed: {
			handleTime() {
				let {
					createTime
				} = this.taskeDetails
				// 第一次拿到的值是undefined所以做一下判断
				if (createTime) {
					// 分割取T前面
					let time = createTime?.split('T')
					return time[0]
				}
			}
		},
		methods:{
			ToReceiveTask(){
				claimTask({id: this.id, customerId: this.customerId}).then(res => {
					console.log(res)
					if(res){
						uni.$u.toast('领取任务成功')
					}
				})
			}
		}
	}
</script>

<style>
</style>
